<template>
  <div class="content fullscreen">
    <router-view></router-view>
    <div class="app-download">
      <div class="gradient">
        <span class="packupArrow"></span>
      </div>
      <div class="app-download__btn" @click="download">打开优越定制App阅读全文</div>
    </div>
  </div>
</template>

<script>
import { openApp } from '../../common/util'
import {
  Tag,
  Col,
  Icon,
  Cell,
  CellGroup,
  Card,
  Button,
  Panel,
  NoticeBar,
  Dialog,
  SubmitBar,
  GoodsAction
} from 'vant'

export default {
  components: {
    [Tag.name]: Tag,
    [Col.name]: Col,
    [Icon.name]: Icon,
    [Cell.name]: Cell,
    [CellGroup.name]: CellGroup,
    [Panel.name]: Panel,
    [Card.name]: Card,
    [Button.name]: Button,
    [NoticeBar.name]: NoticeBar,
    [Dialog.name]: Dialog,
    [SubmitBar.name]: SubmitBar,
    [GoodsAction.name]: GoodsAction,
    openApp
  },
  data () {
    return {
      data: null,
      templates: ['goods', 'article']
    }
  },
  created () {
    console.log('caotamna')
    console.log(this.$route)
    console.log(this.$route.name)

    if (this.$route.name === 'ShareIndex') {
      this.onLoad()
    }
  },
  methods: {
    onLoad () {
      this.axios
        .get('/share', {
          params: this.$route.query,
          headers: { openAuth: true, FastMode: true }
        })
        .then(response => {
          let data = response.data
          console.log(data)
          let type = data.type
          if (this.templates.includes(type)) {
            this.$router.replace({
              path: '/share/' + type,
              query: data
            })
          } else {
            console.log('跳转下载页面')
          }
        })
        .catch(function (error) {
          console.log(error)
        })
    },
    download () {
      openApp(res => {
        this.$router.replace({
          name: 'download'
        })
      })
    }
  }
}
</script>
<style lang="less" scoped>
.fullscreen {
  height: 100%;
  overflow: hidden;
  position: relative;
  background: #fff;
  .container {
    height: 100%;
  }
}

.app-download {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  padding: 20px 15px 15px;
  background: #fff;
  &__btn {
    border: 1px solid #f28f02;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    text-align: center;
    height: 40px;
    width: 100%;
    font-size: 13px;
    line-height: 40px;
    font-weight: 400;
    color: #f28f02;
    display: block;
    text-transform: uppercase;
  }
}
</style>
